﻿<%@ Page Title="" Language="C#" MasterPageFile="~/admin/adminmaster.master" AutoEventWireup="true" CodeFile="dashboard.aspx.cs" Inherits="admin_dashboard" %>
<%@ Register Src="controls/sidebar.ascx" TagName="sidebarcontrol" TagPrefix="sidebar" %>


<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div id="page-wrapper">
        <div id="main-wrapper">
            <div id="main-content">
                <div class="other-box yellow-box ui-corner-all">
                    <div class="cont  ui-corner-all">
                        <h3>
                            Welcome !</h3>
                        <p>
                            <b>Admintasia</b> is a <b>complete</b>, fully and easily customisable <b>backend administration
                                user interface</b>. Please proceed to the actual demo by clicking the <b>Ok</b>
                            button below. Enjoy !</p>
                    </div>
                </div>
                <div class="page-title ui-widget-content ui-corner-all">
                    <h1>
                        Viewing: <b>Dashboard</b></h1>
                    <div class="other">
                        <div class="float-left">
                            You can put some text/buttons here or just remove this div.</div>
                        <div class="button float-right">
                            <a class="btn ui-state-default" href="#"><span class="ui-icon ui-icon-circle-plus"></span>
                                Example</a>
                        </div>
                        <div class="clearfix">
                        </div>
                    </div>
                </div>
                <div class="page-title ui-widget-content ui-corner-all">
                    <h1>
                        Administration Options</h1>
                    <div class="other">
                        <ul id="dashboard-buttons">
                            <li><a class="Book_phones tooltip" title="Book Phone" href="#">Book phones </a></li>
                            <li><a class="Books tooltip" href="#" title="Books">Books </a></li>
                            <li><a class="Box_recycle tooltip" href="#" title="Box recycle">Box recycle </a></li>
                            <li><a class="Books tooltip" href="#" title="Books">Books </a></li>
                            <li><a class="Box_content tooltip" href="#" title="Box content">Box content </a></li>
                            <li><a class="Briefcase_files tooltip" href="#" title="Briefcase files">Briefcase files </a></li>
                            <li><a class="Chart_4 tooltip" href="#" title="Chart ">Chart </a></li>
                            <li><a class="Clipboard_3 tooltip" href="#" title="Clipboard ">Clipboard </a></li>
                            <li><a class="Chart_5 tooltip" href="#" title="Chart">Chart </a></li>
                            <li><a class="Glass tooltip" href="#" title="Glass">Glass </a></li>
                            <li><a class="Globe tooltip" href="#" title="Globe">Globe </a></li>
                            <li><a class="Mail_compose tooltip" href="#" title="Mail compose">Mail compose </a></li>
                            <li><a class="Mail_open tooltip" href="#" title="Mail open">Mail open </a></li>
                            <li><a class="Monitor tooltip" href="#" title="Monitor">Monitor </a></li>
                            <li><a class="Star tooltip" href="#" title="Star">Star </a>
                                <div class="clearfix">
                                </div>
                            </li>
                        </ul>
                        <div class="clearfix">
                        </div>
                    </div>
                </div>
                <div class="title title-spacing">
                    <h2>
                        Dashboard grid example</h2>
                    You can put whatever you like in these containers. I've mode some examples using
                    accordions, buttons, news, tabs and forms. For more grid examples, visit <a title="More layout examples"
                        href="#">this page</a>.
                </div>
                <div class="three-column">
                    <div class="column ui-sortable" unselectable="on" style="-moz-user-select: none;">
                        <div class="portlet form-bg ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
                            <div class="portlet-header ui-widget-header">
                                <span class="ui-icon ui-icon-circle-arrow-s ui-icon-circle-arrow-n"></span>Form
                                Example 2</div>
                            <div class="portlet-content" style="display: none;">
                                
                                <ul>
                                    <li>
                                        <label class="desc">
                                            Email:
                                        </label>
                                        <div>
                                            <input type="text" name="" class="field text full" value="" maxlength="255" tabindex="1">
                                            <span class="red">Error message example ...</span>
                                        </div>
                                    </li>
                                    <li>
                                        <label class="desc">
                                            Password:
                                        </label>
                                        <div>
                                            <input type="password" name="" class="field text full" value="" maxlength="255" tabindex="1">
                                            <label>
                                                These inputs have class="full", which means that they have 100% width.</label>
                                        </div>
                                    </li>
                                    <li class="buttons">
                                        <button id="saveForm" class="ui-state-default ui-corner-all" value="Submit" type="submit">
                                            Login</button>
                                    </li>
                                </ul>
                                
                                <div class="linetop clearfix">
                                </div>
                                <p>
                                    Added class="form-bg" to obtain the light gray background.</p>
                            </div>
                        </div>
                        <div class="portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
                            <div class="portlet-header ui-widget-header">
                                <span class="ui-icon ui-icon-circle-arrow-s ui-icon-circle-arrow-n"></span>Something
                                else ...</div>
                            <div class="portlet-content" style="display: none;">
                                <p>
                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
                                    laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
                                    architecto beatae vitae dicta sunt explicabo.</p>
                                <p>
                                    Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed
                                    quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.</p>
                                <p>
                                    Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci
                                    velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam
                                    aliquam quaerat voluptatem.</p>
                                <p>
                                    Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam,
                                    nisi ut aliquid ex
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="column ui-sortable" unselectable="on" style="-moz-user-select: none;">
                        <div class="portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
                            <div class="portlet-header ui-widget-header">
                                <span class="ui-icon ui-icon-circle-arrow-s ui-icon-circle-arrow-n"></span>Tabs,
                                messages and tables</div>
                            <div class="portlet-content" style="display: none;">
                                <div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
                                    <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
                                        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1">
                                            First</a></li>
                                        <li class="ui-state-default ui-corner-top"><a href="#tabs-2">Second</a></li>
                                        <li class="ui-state-default ui-corner-top"><a href="#tabs-3">Third</a></li>
                                    </ul>
                                    <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
                                        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
                                        incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
                                        exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
                                    <div id="tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
                                        Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet
                                        ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum
                                        bibendum.</div>
                                    <div id="tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
                                        Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi
                                        urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor
                                        ullamcorper augue.</div>
                                </div>
                                <div class="other-box gray-box float-left width50 ui-corner-all">
                                    <div class="cont ui-corner-all">
                                        <h3>
                                            Grey Box</h3>
                                        <p>
                                            Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
                                            laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
                                            architecto beatae vitae dicta sunt explicabo.</p>
                                    </div>
                                </div>
                                <div class="other-box yellow-box float-right width50 ui-corner-all">
                                    <div class="cont ui-corner-all">
                                        <h3>
                                            Notice Box</h3>
                                        <p>
                                            Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
                                            laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi
                                            architecto beatae vitae dicta sunt explicabo.</p>
                                    </div>
                                </div>
                                <div class="clearfix">
                                </div>
                                <i class="note">* Table example below: </i>
                                <div class="hastable">
                                    <table cellspacing="0">
                                        <thead>
                                            <tr>
                                                <td>
                                                    <input type="checkbox" value="" class="checkbox">
                                                </td>
                                                <td>
                                                    Name
                                                </td>
                                                <td>
                                                    Email
                                                </td>
                                                <td>
                                                    Options
                                                </td>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>
                                                    <input type="checkbox" value="" class="checkbox">
                                                </td>
                                                <td>
                                                    John
                                                </td>
                                                <td>
                                                    Lorem .
                                                </td>
                                                <td>
                                                    Options
                                                </td>
                                            </tr>
                                            <tr class="alt">
                                                <td>
                                                    <input type="checkbox" value="" class="checkbox">
                                                </td>
                                                <td>
                                                    John
                                                </td>
                                                <td>
                                                    Lorem .
                                                </td>
                                                <td>
                                                    Options
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <input type="checkbox" value="" class="checkbox">
                                                </td>
                                                <td>
                                                    John
                                                </td>
                                                <td>
                                                    Lorem .
                                                </td>
                                                <td>
                                                    Options
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="column ui-sortable" unselectable="on" style="-moz-user-select: none;">
                        <div class="portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
                            <div class="portlet-header ui-widget-header">
                                <span class="ui-icon ui-icon-circle-arrow-s ui-icon-circle-arrow-n"></span>Buttons</div>
                            <div class="portlet-content" style="display: none;">
                                <p>
                                    Admintasia contains a total of more than 180 icons. I only added a few for demonstration.
                                    In the theme package you will find a page that contains all buttons you have at
                                    your disposal (buttons.html)</p>
                                <ul class="ui-widget ui-helper-clearfix" id="icons">
                                    <li title=".ui-icon-star" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-star">
                                    </span></li>
                                    <li title=".ui-icon-link" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-link">
                                    </span></li>
                                    <li title=".ui-icon-cancel" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-cancel">
                                    </span></li>
                                    <li title=".ui-icon-plus" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-plus">
                                    </span></li>
                                    <li title=".ui-icon-plusthick" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-plusthick">
                                    </span></li>
                                    <li title=".ui-icon-minus" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-minus">
                                    </span></li>
                                    <li title=".ui-icon-minusthick" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-minusthick">
                                    </span></li>
                                    <li title=".ui-icon-close" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-close">
                                    </span></li>
                                    <li title=".ui-icon-script" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-script">
                                    </span></li>
                                    <li title=".ui-icon-alert" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-alert">
                                    </span></li>
                                </ul>
                                <div class="clearfix">
                                </div>
                                <p>
                                    You can transform those icons into links.See the examples below.</p>
                                <div class="clearfix">
                                </div>
                                <a class="btn ui-state-default ui-corner-all" href="#"><span class="ui-icon ui-icon-grip-dotted-horizontal">
                                </span>Button 1 </a><a class="btn ui-state-default ui-corner-all" href="#"><span
                                    class="ui-icon ui-icon ui-icon-gripsmall-diagonal-se"></span>Button 2 </a><a class="btn ui-state-default ui-corner-all"
                                        href="#"><span class="ui-icon ui-icon-grip-solid-horizontal"></span>Button 3
                                </a><a class="btn ui-state-default ui-corner-all" href="#"><span class="ui-icon ui-icon-grip-solid-vertical">
                                </span>Button 3 </a>
                                <div class="clearfix">
                                </div>
                                <p class="title-spacing linetop">
                                    Here is a pagination example:</p>
                                <ul class="pagination">
                                    <li class="previous-off">«Previous</li>
                                    <li class="active">1</li>
                                    <li><a href="#">2</a></li>
                                    <li><a href="#">3</a></li>
                                    <li><a href="#">4</a></li>
                                    <li><a href="#">5</a></li>
                                    <li><a href="#">6</a></li>
                                    <li><a href="#">7</a></li>
                                    <li><a href="#">8</a></li>
                                    <li><a href="#">9</a></li>
                                    <li><a href="#">10</a></li>
                                    <li class="next"><a href="#">Next »</a></li>
                                </ul>
                                <div class="clearfix">
                                </div>
                            </div>
                        </div>
                        <div class="portlet ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
                            <div class="portlet-header ui-widget-header">
                                <span class="ui-icon ui-icon-circle-arrow-s"></span>Notification Messages</div>
                            <div class="portlet-content">
                                <p>
                                    Admintasia contains a total of more than 180 icons. I only added a few for demonstration.
                                    In the theme package you will find a page that contains all buttons you have at
                                    your disposal (buttons.html)</p>
                                <div class="title">
                                    <h3>
                                        Response messages</h3>
                                    Below you will find <b>Admintasia</b> response messages.
                                </div>
                                <div class="response-msg error ui-corner-all">
                                    <span>Error message</span> Lorem ipsum dolor sit amet, consectetuer adipiscing elit
                                </div>
                                <div class="response-msg notice ui-corner-all">
                                    <span>Notice message</span> Lorem ipsum dolor sit amet, consectetuer adipiscing
                                    elit
                                </div>
                                <div class="response-msg inf ui-corner-all">
                                    <span>Information message</span> Lorem ipsum dolor sit amet, consectetuer adipiscing
                                    elit
                                </div>
                                <div class="response-msg success ui-corner-all">
                                    <span>Success message</span> Lorem ipsum dolor sit amet, consectetuer adipiscing
                                    elit
                                </div>
                                <div class="clearfix">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="clearfix">
            </div>
        </div>
        <sidebar:sidebarcontrol  runat="server" />
    </div>
</asp:Content>

